<template>
	<view>
	<!--顶部区域-->
	<view class="smart-page-head">
		<view class="smart-page-head-title">text 文本组件</view>
		</view>
		<view class="smart-padding-wrap">
			<view class="text-box" scroll-y="true">
				<text>{{ text }}</text>
				</view>
				<button type="primary":disabled="!canAdd" @click="add">add line</button>
				<button type="warn":disabled="!canRemove" @click="remove">remove line</button>
	</view>
</view>
</template>

<script>
	export default {
		data() {
			return {
				texts:[
					'HBuilder,400万开发者的选择',
					'高效开发解决方案',
					'轻巧，极速，极客编辑器',
					'支持多端开发',
					'内置丰富插件',
					'语法高亮与提示',
					'一键运行到多端',
					'强大的代码补全',
					'智能纠错功能',
					'自定义主题',
					'支持Markdown',
					'集成终端工具'
				],
				text:'',
				canAdd:true,
				canRemove:false,
				extraLine:[]
			};
		},
		
		methods: {
			add: function(e) {
				this.extraLine.push(this.texts[this.extraLine.length % 12]);
				this.text = this.extraLine.join('\n');
				this.canAdd = this.extraLine.length < 12;
				this.canRemove = this.extraLine.length > 0;
				},
				remove: function(e) {
					if (this.extraLine.length > 0) {
						this.extraLine.pop();
						this.text = this.extraLine.join('\n');
						this.canAdd = this.extraLine.length < 12;
						this.canRemove = this.extraLine.length > 0;
						}
					},
				}
			}
</script>

<style>

</style>
